<!DOCTYPE html>
<html lang="en">

<head>
  {include file="common/meta" /}
</head>

<body>
  <div class="x-body">
    <!-- 搜索 -->
    <div class="layui-row">
      <form method="get" class="layui-form layui-col-md12 x-so">
        <input class="layui-input" placeholder="开始日" name="start" id="start" value="{$start}" />

        <input class="layui-input" placeholder="截止日" name="end" id="end" value="{$end}" />

        <input type="text" name="keywords" placeholder="" autocomplete="off" value="{$keywords}" class="layui-input">

        <button class="layui-btn">
          <i class="layui-icon">&#xe615;</i>
        </button>

        <button class="layui-btn layui-btn-danger x-right">
          <a href="{:url('admin/user/recycle')}"
            style="display: inline-block;width: 100%;height: 100%;color: #fff;">回收站<i
              class="layui-icon">&#xe640;</i></a>
        </button>
      </form>
    </div>


    <xblock>
      <button class="layui-btn layui-btn-danger" onclick="delAll()">
        <i class="layui-icon"></i>批量删除
      </button>

      <span class="x-right" style="line-height:40px">
        共有数据：{$userCount} 条
      </span>
    </xblock>

    <table class="layui-table">
      <thead>
        <tr>
          <th>
            <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i>
            </div>
          </th>
          <th>昵称</th>
          <th>性别</th>
          <th>邮箱</th>
          <th>地址</th>
          <th>创建时间</th>
          <th>个人简介</th>
          <th>积分</th>
          <th>头像/封面</th>
          <th>操作</th>
      </thead>

      <tbody>
        {foreach $userList as $item}
        <tr>
          <td>
            <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id="{$item.id}">
              <i class="layui-icon">&#xe605;</i>
            </div>
          </td>
          <td>
            <a href="{:url('admin/record/index',['id' => $item.id])}">
              {$item.nickname}
              {if condition="$item.vip != '0'"}
              <img src="/assets/admin/images/vip (1).png" alt="" style="width: 30px;">
              <span style="color: #f8b00b;">{$item.vip}</span>
              {else/}
              <img src="/assets/admin/images/vip (2).png" alt="" style="width: 30px;">
              {/if}
            </a>
          </td>
          <td>{$item.sex == 0 ? "男" : "女"}</td>
          <td>
            {if condition="$item.auth == '0'"}
            <img src="/assets/admin/images/ren1.png" alt="" style="width: 30px;">
            {else/}
            <img src="/assets/admin/images/ren2.png" alt="" style="width: 30px;">
            {/if}
            {$item.email}
          </td>
          <td>{$item['region']}</td>
          <td>{$item.createtime}</td>
          <td>{$item.content}</td>
          <td>{$item.point}</td>
          <td>
            <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="showImg(`{$item.avatar}`)">头像</button>
            <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="showImg(`{$item.cover}`)">封面</button>
          </td>
          <td>
            <a title="编辑" href="{:url('admin/user/edit', ['id' => $item.id])}"
              class="layui-btn layui-btn-sm layui-btn-normal">
              编辑信息
            </a>
            <a title="编辑密码" href="{:url('admin/user/revpwd', ['id' => $item.id])}" class="layui-btn layui-btn-sm">
              编辑密码
            </a>
            <a title="删除" href="javascript:;" onclick="delOne(`{$item.id}`)"
              class="layui-btn layui-btn-sm layui-btn-danger">
              添加回收站
            </a>
          </td>
        </tr>
        {/foreach}
      </tbody>
    </table>

    <div class="page">
      {$userListstr}
    </div>

  </div>
</body>

<script>
  layui.use('laydate', function () {
    var laydate = layui.laydate;

    //执行一个laydate实例
    laydate.render({
      elem: '#start' //指定元素
    });

    //执行一个laydate实例
    laydate.render({
      elem: '#end' //指定元素
    });

  });
  // 单个删除
  function delOne(id) {
    layer.confirm('确认添加到回收吗？', function (index) {
      layer.close(index);
      del(id);
    })
  }


  // 批量删除
  function delAll() {
    var ids = tableCheck.getData()
    layer.confirm('确认批量添加到回收吗？', function (index) {
      //将数组转换为字符串
      var data = ids.join(',');
      del(data)
    })
  }

  // 调用删除方法
  function del(data) {
    // 序列化 将对象转换为参数形式
    var params = {
      ids: data,
    }

    params = $.param(params);

    $.ajax({
      type: "POST",
      url: `{:url('admin/user/del')}`,
      data: params,
      dataType: "json",
      success: function (data) {
        if (data.result) {
          // 成功
          layer.msg(data.msg, {
            icon: 1,
            time: 2000,
          }, function () {
            // 收藏成功刷新界面
            location.reload();
          })
        } else {
          // 失败
          layer.msg(data.msg);
        }
      }
    })
  }

  // 显示图集
  function showImg(data) {
    layui.use('laydate', function () {


      layer.open({
        title: "商品详情",
        area: ['620px', 'auto'],
        content: ' <div class="row" style="width: 620px;  margin-left:7px; margin-top:10px; height: 410px;">'
          + `<img style='width: 400px;' src='/${data}'/>`
          + '</div>'

        , btn: ['关闭']
        , yes: function (index, layero) {

          layer.close(index);
        }
      })
    })
  }
</script>

</html>